<?php include("header.php") ?>

    <title>用户登录</title>

    <script>     
       function submitData()
       {
         var name = document.getElementById("username");
         var pwd = document.getElementById("pwd");
         var img = document.getElementsByTagName("img")[0];
         if(!check(name.value.trim().length,pwd.value.trim().length))
         {
           alert("please check your input");
           return false;
         }
       else
       {
         login(name.value,pwd.value);
         name.disabled=true;
         pwd.disabled=true;
         img.style.display="block";
       }
        return false;
       }
       function login(name,pwd)
       {
         $.ajax({
         url:'../ctl?ctl=User&&ac=login',
         method:'post',
         datatype:'json',
         data:{
           name:name,
           pwd:pwd
         },
         success:function(data,status,xhr){
           alert(data);
         }
       });
       }
       function check(name,pwd)
       {
         if(name==0||name>16)
         return false;
         if(pwd ==0||pwd>16)
         return false;
         return true;
       }
    </script>
  </head>
  <body class="bg-color-purple metrouicss" onload="">
    <div style="width:480px;margin:auto;height:100px;margin-top:15%;">
      <div class="bg-color-blueLight" style="width:100px;height:100px;float:left;padding:10px;text-align:center;vertical-align:middle;">
        <p>RedSky</p>
      </div>
      <form action="../ctl/User.php?ctl=User&&ac=login" method="post" id="form1">
      <div style="float:left;padding:10px;">
        <div class="input-control text">
          <input type="text" placeholder="请输入用户名" id="username" name="username"/>
          <button class="helper"></button>
        </div>
        <div class="input-control password">
          <input type="password" placeholder="请输入密码" id="pwd" name="pwd"/>
          <button class="helper"></button>
        </div>         
        <img src="../bootstrap/images/preloader-w8-line-white.gif" alt="处理中..." style="display:none;" />
      </div>
      <div style="float:left;padding:10px;text-align:center;vertical-align:middle;">
        <input type="submit" value="sub" style="display:none" id="sub" onclick="javascript:return submitData();"/>
        <i class="icon-arrow-right-3" style="font-size:49px;color:white;cursor:pointer" onclick="javascript:document.getElementById('sub').click()"></i>
      </div>
      </form>
    </div>
  </body>
</html>